:root{
  --theme-color: #b88154;
}
view {
	box-sizing: border-box;
}

page::-webkit-scrollbar,/deep/::-webkit-scrollbar {
  display: none;
  width: 0 !important;
  height: 0 !important;
  -webkit-appearance: none;
  background: transparent;
  color: transparent;
}
.page {
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
  font-size: 32rpx;
  display: flex;
  flex: 1;
  flex-direction: column;
  width: 100%;
  background-color: $bg-color;
}
// .page-main {width: 100%;flex: 1; box-sizing: border-box; position: relative;}
.page-main {width: 100%;flex: 1; box-sizing: border-box; overflow-y: hidden;}

.page-main .scoller{height: 100%;}
.page-main.padding, .page-main .padding {padding: 10rpx 30rpx 30rpx;}
.page-main.full {margin-left: -30px; margin-right: -30px; }
.page-main.minheight {min-height: calc(100vw - 140rpx - var(--status-bar-height));}

a:hover,input:hover,button:hover,textarea:hover,a:focus,input:focus,button:focus,textarea:focus {
  outline: none;
}
span,.warp{
  word-wrap: break-word; 
  word-break: break-all; 
}
.nowrap{
  white-space: nowrap;
}
.ellipsis {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.clamp2{
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.unselected {
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  user-select:none;
}
.underline {
  text-decoration: underline;
}
a.underline {
  text-decoration: underline;
}

.white {color: #fff;}
.gray {color: #999;}
.gray6 {color: #666;}
.graya {color: #aaa;}
.black {color: #000;}
.orange {color: #DF5220;}
.red {color: #df2039;}
.yellow {color: #EA961E;}
.purple {color: #B750C7;}
.theme{color: $theme-color;}
.blue{ color: #2d8cf0; }
.green{ color: #11aa2b; }
.op5{opacity: .5;}
.vam {vertical-align: middle;}
.ovh{ overflow: hidden; }

.flex {display: flex;}
.flex-items-center {align-items: center;}
.flex-items-end {align-items:flex-end;}
.flex-center {justify-content:center;}
.flex-between {justify-content: space-between;}
.flex-around {justify-content: space-around;}
.flex-evenly {justify-content: space-evenly;}
.flex-start {justify-content:flex-start;}
.flex-end {justify-content:flex-end;}
.flex-column {flex-direction: column;}
.flex-wrap {flex-wrap: wrap;}
.flex-dcs{
  display: flex;
  align-items: center;
}
.flex-0 {flex-shrink: 0; min-width: 0;}
.flex-1 {flex: 1; min-width: 0;}
.flex-2 {flex: 2; min-width: 0;}
.flex-3 {flex: 3; min-width: 0;}
.flex-4 {flex: 4; min-width: 0;}
.flex-5 {flex: 5; min-width: 0;}
.flex-6 {flex: 6; min-width: 0;}
.lh10 {line-height: 1;}
.lh13 {line-height: 1.3;}
.lh14 {line-height: 1.4;}
.lh15 {line-height: 1.5;}
.lh16 {line-height: 1.6;}
.lh17 {line-height: 1.7;}
.lh18 {line-height: 1.8;}
.lh19 {line-height: 1.9;}
.lh20 {line-height: 2;}

.inner {
  padding-left: 30rpx;
  padding-right: 30rpx;
}
.innor {
  margin-left: 20rpx;
  margin-right: 20rpx;
}
.w50{width: 50%;}
.tc, .text-center {text-align: center;}
.tr {text-align: right;}
.fit-height {height: 100%;}
.fit-width {width: 100%;}
.rp {position: relative;}
.ap {position: relative;}
.animated.short{animation-duration: 300ms;}
.animated.normal{animation-duration: 600ms;}
.light{font-weight: 500;}
.blod{font-weight: 700;}
.bloder{font-weight: 900;}
.lighter{font-weight: lighter;}
.disc {-webkit-text-security:disc; text-security:disc;}
.round{border-radius: 150rpx 150rpx;}
.button-white{
  color: #fff;
  border-color: #fff;
  font-size: 28rpx;
  margin: 0;
  background-color: $theme-color;
}
.f20 {font-size:20rpx;}
.f22 {font-size:22rpx;}
.f24 {font-size:24rpx;}
.f25 {font-size:25rpx;}
.f26 {font-size:26rpx;}
.f28 {font-size:28rpx;}
.f30 {font-size:30rpx;}
.f32 {font-size:32rpx;}
.f34 {font-size:34rpx;}
.f36 {font-size:36rpx;}
.f38 {font-size:38rpx;}
.f40 {font-size:40rpx;}
.f46 {font-size:46rpx;}
.f50 {font-size:50rpx;}
.f60 {font-size:60rpx;}
.f70 {font-size:70rpx;}
.f80 {font-size:80rpx;}
.f120 {font-size:120rpx;}

/*margin*/
.m0 {margin: 0rpx;}
.mt2 {margin-top:2rpx}
.mt-30 {margin-top:-30rpx}
.mt5 {margin-top:5rpx}
.mt6 {margin-top:6rpx}
.mt8 {margin-top:8rpx}
.mt10 {margin-top:10rpx}
.mt15 {margin-top:15rpx}
.mt20 {margin-top:20rpx}
.mt22 {margin-top:22rpx}
.mt25 {margin-top:25rpx}
.mt30 {margin-top:30rpx}
.mt35 {margin-top:35rpx}
.mt40 {margin-top:40rpx}
.mt45 {margin-top:45rpx}
.mt50 {margin-top:50rpx}
.mt55 {margin-top:55rpx}
.mt60 {margin-top:60rpx}
.mt65 {margin-top:65rpx}
.mt70 {margin-top:70rpx}
.mt80 {margin-top:80rpx}
.mt90 {margin-top:90rpx}
.mt100 {margin-top:100rpx}
.mt110 {margin-top:110rpx}
.mt120 {margin-top:120rpx}
.mt150 {margin-top:150rpx}
.mt190 {margin-top:190rpx}

.mb10 {margin-bottom:10rpx}
.mb15 {margin-bottom:15rpx}
.mb20 {margin-bottom:20rpx}
.mb30 {margin-bottom:30rpx}
.mb40 {margin-bottom:40rpx}
.mb50 {margin-bottom:50rpx}
.mb60 {margin-bottom:60rpx}
.mb100 {margin-bottom:100rpx}

.ml5 {margin-left:5rpx}
.ml6 {margin-left:6rpx}
.ml10 {margin-left:10rpx}
.ml12 {margin-left:12rpx}
.ml15 {margin-left:15rpx}
.ml20 {margin-left:20rpx}
.ml25 {margin-left:25rpx}
.ml30 {margin-left:30rpx}
.ml40 {margin-left:40rpx}
.ml45 {margin-left:45rpx}
.ml50 {margin-left:50rpx}
.ml70 {margin-left:70rpx}
.ml80 {margin-left:80rpx}
.ml100 {margin-left:100rpx}
.ml120 {margin-left:120rpx}
.ml150 {margin-left:150rpx}
.ml300 {margin-left:300rpx}

.mr5 {margin-right:5rpx}
.mr10 {margin-right:10rpx}
.mr15 {margin-right:15rpx}
.mr20 {margin-right:20rpx}
.mr30 {margin-right:30rpx}
.mr40 {margin-right:40rpx}
.mr50 {margin-right:50rpx}
.mr100 {margin-right:100rpx}

/*padding*/
.p10 {padding:10rpx;}
.p15 {padding:15rpx;}
.p30 {padding:30rpx;}

.pt0 {padding-top: 0;}
.pt5 {padding-top:5rpx}
.pt8 {padding-top:8rpx}
.pt10 {padding-top:10rpx}
.pt15 {padding-top:15rpx}
.pt20 {padding-top:20rpx}
.pt30 {padding-top:30rpx}
.pt40 {padding-top:40rpx}
.pt45 {padding-top:45rpx}
.pt50 {padding-top:50rpx}
.pt60 {padding-top:60rpx}
.pt100 {padding-top:100rpx}

.pb5 {padding-bottom:5rpx}
.pb10 {padding-bottom:10rpx}
.pb15 {padding-bottom:15rpx}
.pb20 {padding-bottom:20rpx}
.pb30 {padding-bottom:30rpx}
.pb40 {padding-bottom:40rpx}
.pb50 {padding-bottom:50rpx}
.pb100 {padding-bottom:100rpx}

.pl5 {padding-left:5rpx}
.pl10 {padding-left:10rpx}
.pl15 {padding-left:15rpx}
.pl20 {padding-left:20rpx}
.pl30 {padding-left:30rpx}
.pl35 {padding-left:35rpx}
.pl40 {padding-left:40rpx}
.pl45 {padding-left:45rpx}
.pl50 {padding-left:50rpx}
.pl80 {padding-left:80rpx}
.pl100 {padding-left:100rpx}

.pr5 {padding-right:5rpx}
.pr10 {padding-right:10rpx}
.pr15 {padding-right:15rpx}
.pr20 {padding-right:20rpx}
.pr30 {padding-right:30rpx}
.pr40 {padding-right:40rpx}
.pr50 {padding-right:50rpx}
.pr80 {padding-right:80rpx}
.pr100 {padding-right:100rpx}

[button] {
	&:active {
		opacity: .7;
	}
}


@import "@/static/css/plug.scss";

@import "@/static/css/style.scss";
